<template>
  <div id="my_address">
    <div id="address">
      <header class="top_bar">
        <a @click="gotoPage()" class="icon_back"></a>
        <h3 class="addressName" align="center">我的地址</h3>
      </header>
    </div>

    <main class="collect_box">
      <div class="cart_tip clearfix" v-if="userId==''">
        <span>登录后可同步电脑与手机收货地址列表</span>
        <a href="#" class="login" @click="login">登录</a>
      </div>
      <div class="address-list" v-if="addressList.length > 0 ">
        <div class="item" v-for="(item,index) in addressList" :key="item.id">
          <div class="l">
            <div class="name">{{item.name}}</div>
            <div class="default" v-if="item.isDefault">默认</div>
          </div>
          <div class="c"  @click="editAddress(item.id)">
            <div class="mobile">{{item.mobile}}</div>
            <div class="address">{{item.detailedAddress}}</div>
          </div>
          <div class="r">
            <div class="deleteIcon" @click="deleteAddress(item.id,index)"></div>
          </div>

        </div>
      </div>
      <!-- <div class="empty-view" v-else>
        <text class="text">添加收货地址</text>
      </div> -->
    </main>

    <div class="bottom">
      <footer class="address_footer">
        <div class="add_text" @click="addNewAddress()">添加新地址</div>
      </footer>
    </div>
  </div>
</template>
<script>
import { MessageBox } from 'mint-ui'

export default {
  components: {
    MessageBox
  },
  data() {
    return {
      addressList: [],
      userId: '',
      type: ''
    }
  },
  mounted() {
    this.type = this.$route.params.type
    this.getAddressList()
  },
  methods: {
    gotoPage() {
      var _this = this
      if (_this.type === '1') {
        _this.$router.push('/mine')
      } else if (_this.type === '2') {
        _this.$router.push('/pay')
      }
    },
    getAddressList() {
      this.$store.dispatch('hideNav')
      let _this = this
      if (window.sessionStorage.userInfo) {
        let uObj = JSON.parse(window.sessionStorage.userInfo)
        _this.userId = uObj.id
        _this.$http
          .get('/mechanism/address/list', {
            params: {
              userId: _this.userId
            }
          })
          .then(res => {
            if (res.data.errno === 0) {
              _this.addressList = res.data.data
            }
          })
      }
    },

    editAddress(itemId) {
        if (window.sessionStorage.a) {

	        window.sessionStorage.removeItem("a")
          this.$router.push('/pay/' + itemId)
        } else {
          this.$router.push('/addressAdd/' + itemId)
        }
    },

    addNewAddress() {
      this.$router.push('/addressAdd')
    },

    deleteFunction(itemId, index) {
      let _this = this
      console.log(itemId)
      _this.$http
        .get('/mechanism/address/delete', {
          params: {
            userId: _this.userId,
            id: itemId
          }
        })
        .then(res => {
          if (res.data.data.num === 1) {
            this.addressList.splice(index, 1)
          }
        })
    },

    deleteAddress(itemId, index) {
      MessageBox.confirm('确认删除此地址', '提示', {
        showCancelButton: true,
        confirmButtonText: '确认',
        cancelButtonText: '取消'
      })
        .then(() => {
          this.deleteFunction(itemId, index)
        })
        .catch(() => {})
    },

    login() {
      this.$router.push('/login')
    }
  }
}
</script>
<style>
@import '../assets/css/address.css';
</style>
